{layout name="layout/header" /}
<link href="root/css/plugins/footable/footable.core.css" rel="stylesheet">
<link href="root/css/plugins/iCheck/custom.css" rel="stylesheet">
<link href="root/js/plugins/fancybox/jquery.fancybox.css" rel="stylesheet">

<link href="root/css/plugins/switchery/switchery.css" rel="stylesheet">
<script src="root/js/plugins/switchery/switchery.js"></script>
<!--<link href="root/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">-->
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5><span class="text-danger">{$lottery.name}</span> 奖品设置</h5>
                </div>
                <div class="ibox-content">
                    <p>
                        <a href="#" class="btn btn-danger btn-outline" id="add">新增</a>
                        <button type="button" class="btn btn-primary btn-outline refresh">刷新</button>
                        <a type="button" class="btn btn-primary btn-outline" href="{:url('lottery/index')}">返回列表页</a>
                    </p>
                    <form class="form-inline">
                        <div class="form-group">
                            <select class="form-control " id="type">
                                <option value="0">全部</option>
                                <option value="1">未中奖</option>
                                <option value="2">实物奖品</option>
                                <option value="3">虚拟奖品</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <input type="text" id="keyword" class="form-control" placeholder="名称" value="{$keyword}">
                        </div>
                        <a class="btn btn-success search">查询</a>
                    </form>
                </div>
                <div class="ibox-content">

                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>名称</th>
                                <th>类型</th>
                                <th>奖品数量</th>
                                <th>中奖值</th>
                                <th>图片</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                        {volist name="data.list" id="vo"}
                        <tr pid="{$vo.id}" >
                            <td>{$vo.name}</td>
                            <td>{switch name="$vo.type"}
                                {case value="1"}<span class="text-danger">未中奖</span>{/case}
                                {case value="2"}<span class="text-success">实物奖品</span>{/case}
                                {case value="3"}<span class="text-info">虚拟奖品</span>{/case}
                                {/switch}
                            </td>
                            <td>{if condition="$vo.type > 1"}{$vo.stock}
                                {else/}
                                不限制
                                {/if}</td>
                            <td>{$vo.chance}</td>
                            <td> <a class="fancybox" href="{$vo.img}">
                                <img style="width: 80px;" alt="image" src="{$vo.img}"/>
                            </a></td>



                            <td>
                                <a type="button" class="btn btn-success btn-sm edit" href="#">编辑</a>
                                <a type="button" class="btn btn-danger btn-sm delete" pid="{$vo.id}" href="#">删除</a>
                            </td>
                        </tr>
                        {/volist}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- iCheck -->
<script src="root/js/plugins/iCheck/icheck.min.js"></script>
<script src="root/js/plugins/fancybox/jquery.fancybox.js"></script>

<script>
    $(document).ready(function() {
        checks();
        //单选，复选按钮
        function checks () {
            $('.i-checks').iCheck({
                checkboxClass: 'icheckbox_square-green',
                radioClass: 'iradio_square-green'
            })
        }
        $('.fancybox').fancybox({
            openEffect: 'none',
            closeEffect: 'none'
        });
        var elem = document.querySelectorAll('.js-switch');
        elem.forEach(function(i,index){
            var a= "a" +index;
            a = new Switchery(i, {
            color: '#1AB394'
            });
        });
        var lottery_id = "{$lottery.id}";
        //搜索
        $('.search').click(function () {
            var keyword = $("#keyword").val().trim();
            type = $("#type").val();
            var url = "{:url('index')}"+"/lottery_id/"+lottery_id+"/type/"+type+'/keyword/'+keyword;
            window.location.href = url;
        });

        //新添扩展字段
        $('#add').click(function () {
            var url = "{:url('add')}"+"/lottery_id/"+lottery_id;
            edit(url);
        });

        $('.edit').click(function () {
            var id = $(this).parent().parent().attr('pid');
            var url = "{:url('update')}"+"/lottery_id/"+lottery_id+"/id/"+id;
            edit(url);
        });
        function edit(url) {
            layer.open({
                type: 2,
                title: "编辑栏目",
                // closeBtn: 0, //不显示关闭按钮
                // shadeClose: true,
                // shade: false,
                maxmin: true, //开启最大化最小化按钮
                // shade: [0],
                area: ['1020px', '700px'],
                content: [url], //iframe的url，no代表不显示滚动条
            });
        }
        $('.delete').click(function(){
            var id = $(this).attr('pid');
            var $this = $(this);
            var msg ='确定删除吗？';
            layer.confirm(
                msg,
                { btn: ['确定','取消'] },//按钮
                function() {
                    $.ajax({
                        url:"{:url('ajax_del')}",
                        type:'post',
                        data:{ id: id, lottery_id: lottery_id },
                        dataType:'json',
                        success:function (data) {
                            layer.msg(data.msg);
                            if(data.code ==1){
                                if(id==0){
                                    setTimeout(function () {
                                        window.location.reload();
                                    },1500)
                                }else {
                                    $this.parent().parent().remove();
                                }
                            }
                        }
                    })
                },
                function() {
                }
            );
        });
    });
</script>
